//父子组件
import React,{useState,createContext,useContext} from 'react';



//子组件
function Counter(){
    //!子组件接受父组件传过来的值 第二步 ,CountContext 为父组件穿件context的值
    let data = useContext(CountContext)//接收父组件传的值
    return(
        <>
            <h1>{data.count}</h1>
            <button onClick={()=>{console.log(data.count) }}>点击</button>
        </>
       
    )
}
//父组件创建context 第一步
let CountContext= createContext({});//创建Context
function ExampleContext(){
    let [count,setCount] = useState(0)
    let [name,setName] = useState(0)
    return(
        <div>
            <p>You clicked {count} times</p>
            <button onClick={()=>{setCount(++ count)}}>点击</button>
            {/* 父组件将count 值传给子组件Counter */}
            <CountContext.Provider value={{count,name}}>
                <Counter />
            </CountContext.Provider>
        </div>
    )
}

export default ExampleContext;